<template>
  <quick-search-layout>
    <template #condition>
      <el-form
        :model="condition"
        ref="form"
        inline
        size="small"
        label-position="top"
        label-width="0"
      >
        <!-- <el-form-item prop="project_id">
          <el-select
            v-model="condition.project_id"
            placeholder="请选择项目"
            clearable
          >
            <el-option
              v-for="item in projectOpt"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="project_module_id">
          <el-select
            v-model="condition.project_module_id"
            placeholder="请选择功能"
            clearable
          >
            <el-option
              v-for="item in moduleOpt"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item> -->
        <el-form-item prop="name">
          <el-input v-model="condition.name" placeholder="需求名称" clearable>
          </el-input>
        </el-form-item>

        <el-button
          size="small"
          explain
          type="primary"
          icon="el-icon-search"
          @click="getNeeds"
          >搜索</el-button
        >
        <el-button size="small" explain icon="el-icon-refresh" @click="reset"
          >重置</el-button
        >
      </el-form>
    </template>

    <slot slot="list" />

    <template #pagination>
      <el-pagination
        @size-change="getNeeds"
        @current-change="getNeeds"
        :current-page.sync="condition.page_index"
        :page-sizes="[5, 8, 10, 20, 30, 40, 50, 100, 200]"
        :page-size.sync="condition.page_size"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </template>
  </quick-search-layout>
</template>

<script>
import _api from "../../common/api/project_demand";
import _module from "../../common/api/project_module";
import _project from "../../common/api/project";

export default {
  data() {
    return {
      total: 0,
      condition: {
        project_module_id: "",
        project_id: "",
        name: "",
        page_index: 1,
        page_size: 10,
      },
      module: {
        page_index: 1,
        page_size: 10,
      },
      project: {
        page_index: 1,
        page_size: 10,
      },
      // moduleOpt: [],
      // projectOpt: [],
    };
  },
  methods: {
    async getNeeds() {
      try {
        this.condition.project_id = +localStorage.getItem("project_id");
        this.condition.project_module_id =
          +localStorage.getItem("project_module_id");
        const result = await _api.getListAsync(this.condition);
        console.log(result);
        this.total = +result.total;
        this.$emit("onSearch", result.data);
      } catch (error) {}
    },

    // async getModule() {
    //   try {
    //     const result = await _module.getListAsync(this.module);
    //     const module = result.data.map((item) => {
    //       return {
    //         value: item.id,
    //         label: item.name,
    //       };
    //     });
    //     this.moduleOpt = module;
    //     this.$emit("onModule", module);
    //   } catch (error) {}
    // },

    // async getProject() {
    //   try {
    //     const result = await _project.getListAsync(this.project);
    //     const project = result.data.map((item) => {
    //       return {
    //         value: item.id,
    //         label: item.name,
    //       };
    //     });
    //     this.projectOpt = project;
    //     this.$emit("onProject", project);
    //   } catch (error) {}
    // },

    async reset() {
      this.$refs.form.resetFields();
      await this.getNeeds();
    },

    getModuleDetail() {
      if (this.$route.params.module == undefined) {
        return;
      }
      const project_module_id = this.$route.params.module.id;
      localStorage.setItem("project_module_id", project_module_id);
      console.log(localStorage.getItem("project_module_id"));
    },
  },
  created() {
    this.getModuleDetail();
    this.getNeeds();
    // this.getModule();
    // this.getProject();
  },
};
</script>

<style lang="scss" scoped>
</style>